<template>
	<view class="container">
		<view class="top">
			<view class="top_title">
				<view class="titles">
					<view class="titlex">
						<text class="title">审批分类:</text>
						<text class="titlez">{{processInsName}}</text>
					</view>
				</view>
				<view class="titles">
					<text class="applicant">接待人:<text>{{body.subscribe.receptionistIdText}}</text></text>
				</view>
				<view class="titles">
					<text class="time">{{body.subscribe.createdTime}}</text>
				</view>
			</view>
		</view>
		<!-- 物资领用流程 -->
		<view class="materialData">
			<view class="material">
				<view class="title">
					<text class="text">会员基础信息</text>
				</view>
				<table cellSpacing="0" cellpadding="1" width="100%" class="ctl">
				    <tBody>
				        <tr>
							<td class="td_1">姓名:</td>
							<td class="td">{{body.command.memberName}}</td>
						</tr>
						<tr>
							<td class="td_1">性别:</td>
							<td class="td">{{body.subscribe.genderText}}</td>
						</tr>
						<tr>
							<td class="td_1">学历:</td>
							<td class="td">{{body.subscribe.educationText}}</td>
						</tr>
						<tr>
							<td class="td_1">会员类型:</td>
							<td class="td">{{body.subscribe.memberTypeText}}</td>
						</tr>
						<tr>
							<td class="td_1">地址:</td>
							<td class="td">{{body.subscribe.address}}</td>
						</tr>
						<tr>
							<td class="td_1">身份证号:</td>
							<td class="td">{{body.subscribe.idCard}}</td>
						</tr>
						<tr>
							<td class="td_1">联系方式:</td>
							<td class="td">{{body.subscribe.phone}}</td>
						</tr>
				    </tBody>
				</table>
				<view class="title">
					<text class="text">预订产品</text>
				</view>
				<table cellSpacing="0" cellpadding="1" width="100%" class="ctl">
				    <tBody>
						<tr>
							<td class="td_1">销售方案:</td>
							<td class="td">{{salebody.salePlan.cardName}}</td>
						</tr>
						<tr>
							<td class="td_1">方案户型:</td>
							<td class="td">{{salebody.salePlan.typeIdText}}</td>
						</tr>
						<!-- <tr v-for="(item,index) in houseInfo.data" :key="index">
							<td class="td_1">房屋:</td>
							<td class="td">{{item.}}</td>
						</tr> -->
						<tr>
							<td class="td_1">会员卡费用:</td>
							<td class="td">{{salebody.salePlan.cardFee}}元</td>
						</tr>
						<tr>
							<td class="td_1">单人服务费:</td>
							<td class="td">{{salebody.salePlan.singleServiceFee}}元/年</td>
						</tr>
						<tr>
							<td class="td_1">双人服务费:</td>
							<td class="td">{{salebody.salePlan.doubleServiceFee}}元/年</td>
						</tr>
						<tr>
							<td class="td_1">应缴卡费:</td>
							<td class="td">{{salebody.salePlan.cardFee}}元</td>
						</tr>
				    </tBody>
				</table>
			</view>
			<view class="reviewComments" >
				<view><text>审核意见:</text></view>
				<hr>
				<scroll-view scroll-y="true" class="scrollview">
					<textarea class="textarea" maxlength="2000" v-model="opinion" placeholder="请输入审核意见"></textarea>
				</scroll-view>
			</view>
		</view>
		<view class="result">
			<view>
				<view :class="{fail:current==2}" @click="fail()">
					<text>不通过</text>
				</view>
				<view :class="{fail:current==1}" @click="adopt()">
					<text>通过</text>
				</view>
			</view>
		</view>
	</view>
</template>


<script>
	export default {
		data() {
			return {
				auditResult:'',
				businessId:'',
				opinion:'',
				processInstanceId:'',
				taskInstanceId:'',
				auditor:'',
				processInsName: '',
				flowNo: '',
				businessId: '',
				flowName: '',
				current: 1,
				uniqueNo:'',
				body: {
					subscribe: {},
					command: {},
				},
				salebody:{
					salePlan:{},
				},
				houseInfo:{
					data:[]
				},
			}
		},
		onLoad: function(option) { //option为object类型，会序列化上个页面传递的参数
			this.businessId = option.businessId
			this.processInsName = option.processInsName
			this.flowNo = option.flowNo
			this.flowName = option.flowName
			console.log(this.flowNo, this.businessId, this.processInsName, this.flowName)
			// console.log(this.flowNo, this.flowName)
			this.reserve()
			this.getUser()
		},
		methods: {
			async reserve() {
				const res = await this.$myRequest({
					url: '/api-sale/subscribe/process/taskId/' + this.businessId,
					method: "get",
				})
				if (res.success == true) {
					this.body = res.body
			        this.planId=res.body.subscribe.planId
					this.uniqueNo=res.body.subscribe.uniqueNo
					this.processInstanceId= res.body.taskInstance.processInstance.processInstanceId
					this.taskInstanceId= res.body.taskInstance.taskInstanceId
					this.member()
					this.house()
				}
			},
			async member() {
				const res = await this.$myRequest({
					url: '/api-sale/config/plan/' + this.planId,
					method: "get",
				})
				if (res.success == true) {
					this.salebody = res.body
				}
			},
			async house() {
				const res = await this.$myRequest({
					url: '/api-sale/config/house/house-info/',
					method: "get",
					data:{
						uniqueNo:this.uniqueNo
					},
				})
				if (res.success == true) {
					this.houseInfo = res.body.houseInfo
				}
			},
			async getUser() {
				const res = await this
					.$myRequest({
						url: '/api-portal/currentUser'
					})
				if (res.success == true) {
					this.auditor = res.body.currentUser.name;
					// console.log(JSON.stringify(res.body.currentUser))
				}
			},
			adopt() {
				console.log("通过")
				if (this.opinion == '') {
					this.opinion = "通过"
				}
				this.auditResult = "01"
				const res = this.$myRequest({
					url: '/api-flow/api/save',
					method: "post",
					data: {
						auditResult: this.auditResult,
						auditor: this.auditor,
						businessId: this.businessId,
						opinion: this.opinion,
						processInstanceId: this.processInstanceId,
						taskInstanceId: this.taskInstanceId,
					}
				})
				if (res.success == true) {
					console.log(JSON.stringify(res))
				}
				console.log(this.businessId)
				console.log(this.processInstanceId)
				console.log(this.taskInstanceId)
				console.log(this.auditResult)
				console.log(this.auditor)
				console.log(this.opinion)
				this.current = 1;
				uni.redirectTo({
				    url: '/pages/approve/index'
				});
			},
			fail() {
				console.log("不通过")
				if (this.opinion == '') {
					this.opinion = "不通过"
				}
				this.auditResult = "02"
				const res = this.$myRequest({
					url: '/api-flow/api/save',
					method: "post",
					data: {
						auditResult: this.auditResult,
						auditor: this.auditor,
						businessId: this.businessId,
						opinion: this.opinion,
						processInstanceId: this.processInstanceId,
						taskInstanceId: this.taskInstanceId,
					}
				})
				if (res.success == true) {
					console.log(JSON.stringify(res))
				}
				this.current = 2;
				uni.redirectTo({
				    url: '/pages/approve/index'
				});
			},
		}
	}
</script>

<style lang="scss">
	.top {
		width: 100%;
		height: 190rpx;
		background-color: #FFFFFF;
		color: #959595;
		padding-top: 30rpx;
		.top_title{
			width: 84%;
			margin:  0 auto;
			.titles{
				.titlex{
					display: flex;
				}
				.title {
					font-size: 28rpx;
					font-weight: bold;
					width: 26%;
				}
				.titlez {
					font-size: 28rpx;
					font-weight: bold;
					color: #000000;
				}
			}
			
			
			.applicant {
				font-size: 28rpx;
				font-weight: bold;
				// position: absolute;
				left: 65rpx;
				margin-top: 80rpx;
			
				text {
					margin-left: 10rpx;
					font-size: 28rpx;
					font-weight: bold;
					color: #000000;
				}
			}
			
			.time {
				font-size: 28rpx;
				margin-top: 130rpx;
				color: #959595;
			}
		}
	}

	.materialData {
		.material {
			width: 84%;
			height: auto;
			border-radius: 10rpx;
			margin: 20rpx auto 0 auto;
			padding-left: 40rpx;
			padding-right: 20rpx;
			font-size: 28rpx;
			font-weight: bold;
			color: #959595;
			background-color: #FFFFFF;
			

			.title {
				width: 100%;
				height: 50rpx;
				padding-top: 20rpx;
				line-height: 50rpx;
                    .text {
						width: 100%;
						font-size: 35rpx;
						font-weight: bold;
						color: #109EF8;
					}
			}
			.ctl{
				padding: 20rpx 0;
				table-layout:fixed;
				.td_1{
					vertical-align:top;
					width: 30%;
					word-break:break-all;
				}
								
				.td{
				        word-break:break-all;
						font-size: 28rpx;
						font-weight: bold;
						color: #000000;
				    }
			    }
			
		}

		.reviewComments {
			width: 84%;
			height: 170px;
			font-size: 28rpx;
			font-weight: bold;
			border-radius: 10rpx;
			margin: 20rpx auto 0 auto;
			padding-left: 40rpx;
			padding-right: 20rpx;
			color: #959595;
			background-color: #FFFFFF;

			.textarea {
				width: 100%;
				height: 110px;
				font-size: 28rpx;
				font-weight: bold;
				color: #000000;
			}

			view {
				padding-top: 30rpx;
				width: 100%;
				height: 50rpx;
				;
				line-height: 50rpx;
				;
			}

			hr {
				width: 100%;
				height: 2px;
				border: 0;
				margin-bottom: 10rpx;
				background-color: #c3c7cc;
			}
		}
	}

	.result {
		width: 92%;
		height: 80rpx;
		line-height: 80rpx;
		margin: 40rpx auto 50rpx auto;
		display: flex;
		justify-content: space-between;

		view {
			display: flex;
			width: 100%;

			view {
				margin: 0;
				padding: 0;
				width: 50%;
				border: 1px solid;
				color: #109EF8;

				text {
					text-align: center;
					color: #109EF8;
					width: 100%;
				}
			}

			.fail {
				margin: 0;
				padding: 0;
				width: 50%;
				background-color: #109EF8;
				border: 1px solid;
				color: #109EF8;

				text {
					text-align: center;
					color: #FFFFFF;
					width: 100%;
				}
			}
		}
	}
</style>
